<template>
  <div class="page-common">
    <div v-if="isNeedAuthUserInfo">
      <auth-userinfo></auth-userinfo>
    </div>
    <msg-box v-if="validateErrors.length > 0" :msg="validateErrors" type="error"></msg-box>
    <loading v-if="isPageLoading"></loading>
    <msg></msg>
    <div style="border-top: 1rpx solid #ddd; background-color: #ddd;position: fixed;top: 0;left: 0;width: 100%;z-index: 10;"></div>
  </div>
</template>

<script>
import AuthUserinfo from '@/components/auth-userinfo'
import MsgBox from '@/components/msg-box'
import { mapGetters, mapState, mapActions } from 'vuex'
import Loading from '@/components/loading'
import Msg from '@/components/msg'

export default {
  components: {
    AuthUserinfo,
    MsgBox,
    Loading,
    Msg
  },
  data () {
    return {
    }
  },
  computed: {
    ...mapGetters([
      'isNeedAuthUserInfo',
      'isLoading',
      'isPageLoading',
      'validateErrors'
    ])
  },
  mounted () {
  },
  watch: {
    validateErrors (nv) {
      if (this.st) clearTimeout(this.st)
      if (nv.length <= 0) return
      this.st = setTimeout(() => {
        this.resetValidateError()
      }, 2000)
    },
    isLoading (nv) {
      if (!nv) {
        wx.hideLoading()
        return
      }
      wx.showLoading({mask: true})
    }
  },
  methods: {
    logined (loginer) {
      console.info(loginer)
    },
    ...mapActions([
      'resetValidateError'
    ])
  }
}
</script>

<style>
</style>
